<template>
	<view class="">
		<a-result status="warning" title="系统暂时不允许注册" v-if="!canRegister" />
		<form class="radius register-form" v-else>
			<view class="text-xl padding " >
				<!-- <image src="../../static/favicon.png" class="logo" /> -->
				<text class="text-bold">请填写注册表</text>
			</view>
			<view class="cu-form-group">
				<view class="title required">证件类型</view>
				<dict-select v-model:value="model.CodeType" dict="证件类型" remove="教工号" />
			</view>
			<view class="cu-form-group">
				<view class="title required">证件号</view>
				<input v-model="model.Code" placeholder="请填写证件号" />
			</view>
			<view class="cu-form-group">
				<view class="title required">姓名</view>
				<input v-model="model.RealName" placeholder="姓名必须与证件上的姓名保持一致！" class="userName" />
			</view>
			<view class="cu-form-group">
				<view class="title required">手机号</view>
				<input v-model="model.Mobile" placeholder="请填写手机号" />
			</view>
			<view class="cu-form-group">
				<view class="title required">邮箱</view>
				<input v-model="model.Email" placeholder="请填写邮箱" />
			</view>
			<view class="cu-form-group">
				<view class="title required">性别</view>
				<picker @change="model.Gender = ($event.detail.value === 0 ? '男' : '女')" :value="model.Gender === '男' ? 0 : 1" :range="['男', '女']">
					<view class="picker" style="text-align: left;">
						{{ model.Gender }}
					</view>
				</picker>
			</view>
			<view class="cu-form-group">
				<view class="title required">密码</view>
				<input v-model="model.Password" placeholder="请输入密码" type="password" />
			</view>
			<view class="cu-form-group">
				<view class="title required">确认密码</view>
				<input v-model="model.ConfirmPassword" placeholder="请确认密码" type="password" />
			</view>
			<view class="cu-form-group">
				<view class="title required">所在部门</view>
				<depart-selector v-model:value="model.departId" />
			</view>
			<view class="flex flex-direction margin">
				<button class="cu-btn bg-blue lg radius" @click="onBasicSubmit">
					注册
				</button>
			</view>
		</form>
	</view>
</template>

<script setup>
	import { ref, computed, provide, onMounted, reactive } from 'vue';
	import app from '../../app';
	import axios from '@/axios';
	
	const canRegister = ref(false);
	const form = ref();
	async function readRegisterStatus () {
	    let msg = await axios.post("/api/applications/CanRegister");
	    canRegister.value = msg.success;
	}
	
	const empty = {
	    "RealName": "",
	    "Code": "",
	    "DisplayOrder": 0,
	    "Mobile": "",
	    "Email": "",
	    "UserName": "",
	    "OpenId": "",
	    "Avatar": "",
	    "Level": 3,
	    "RootDepartId": app.GUID_EMPTY,
	    "LockCount": 0,
	    "LockTo": "",
	    "AuditStatus": 1,
	    "UserSource": "自行注册",
	    "Gender": "男",
	    "CodeType": "居民身份证",
	    "BankName": "",
	    "CardNumber": "",
	    "Password": "",
	    "UserPassword": "",
	    "ConfirmPassword": "",
	    "departId": app.GUID_EMPTY,
	    "ID": app.GUID_EMPTY
	};
	const model = reactive({ ...empty });
	
	async function onBasicSubmit() {
	    try {
			if (model.departId === app.GUID_EMPTY) {
				alert("必须选择所在部门");
				return;
			}
			
			if (model.Code === '') {
				alert("必须填写证件号");
				return;
			}
			
			if (model.RealName === '') {
				alert("必须填写姓名");
				return;
			}
			
			if (model.Password === '') {
				alert("必须填写密码");
				return;
			}
			
			if (model.Password.length < 6 || model.Password.length > 20) {
				alert("密码的长度必须在6-20位之间");
				return;
			}
			
			if (model.Password !== model.ConfirmPassword) {
				alert("两次输入的密码必须相同");
				return;
			}
			
	        const submitModel = { ...model };
	        submitModel.UserPassword = app.sha1(submitModel.Password);
	        delete submitModel.Password;
	        delete submitModel.ConfirmPassword;
	        let msg = await axios.post("/api/users/Register", submitModel);
	        if (msg.success) {
	            alert("注册成功");
	        } else {
				let arr = Array.from(new Set(msg.errorStrings));
				alert(arr.join("\n"));
	        }
	    } catch {} finally {
	        
	    }
	}
	
	onMounted(_ => {
		readRegisterStatus();
	})
</script>

<style lang="less">
.register-form {
	.title {
		width: 6em;
		text-align: right;
		position: relative;
		&.required::after {
			content: '*';
			color: red;
			position: absolute;
			right: 10rpx;
		}
	}
	.userName .input-placeholder {
		color: red;
	}
}
</style>
